<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <title>任务列表</title>
  
  <#import "/public/common.ftl" as common>
  <@common.plan_css datepicker=true page=true/>
  <@common.plan_js datepicker=true form=true/>

  <script type="text/javascript">
    $(function(){
      var p = "${orderp!}";
      var sort = "${sort!}";
      if(p!='' && sort!='') {
        $('.ordreby[p="'+p+'"]').addClass('sort-'+sort);
      }
      $('#endTime, #startTime,#createTime').datepicker({format:'yyyy-mm-dd'});
      $('.time-input').datepicker({format:'yyyy-mm-dd'}).on('changeDate',function(a, b) {
          var data = {};
          data.id = $(a.target).closest('tr').attr('pid');
          var p = $(a.target).attr('p');
          data[p] = $(a.target).val();
          $.ajax({
            url:'${base}/work/plan/save.json',
            type:'post',
            data:data,
            dataType:'json',
            success : function(r) {
              if(r.code!=0) {
                alert(r.message);
              }
            },
            error : function() {
              alert('操作失败');
            }
          })
        });
      <@common.page_js formid="myform"/>
      $('.ordreby').click(function(){
        var p = $(this).attr('p');
        var sort = 'desc';
        if($(this).hasClass('sort-desc')) {
          sort = "asc";
        } else {
          sort = "desc";
        }
        $('#orderp').val(p);
        $('#sort').val(sort);
        // $('.ordreby').removeClass('sort-desc, sort-asc');
        // $(this).addClass('sort-'+sort);

        $('#myform').submit();
      });
      $('.priority-change').change(function(){
        var data = {};
        data.id = $(this).closest('tr').attr('pid');
        data.priority = $(this).val();
        $.ajax({
          url:'${base}/work/plan/save.json',
          type:'post',
          data:data,
          dataType:'json',
          success : function(r) {
            if(r.code!=0) {
              alert(r.message);
            }
          },
          error : function() {
            alert('操作失败');
          }
        })
      })
      $('.progress-change').change(function(){
        var data = {};
        data.id = $(this).closest('tr').attr('pid');
        data.progress = $(this).val();
        $.ajax({
          url:'${base}/work/plan/save.json',
          type:'post',
          data:data,
          dataType:'json',
          success : function(r) {
            if(r.code!=0) {
              alert(r.message);
            }
          },
          error : function() {
            alert('操作失败');
          }
        })
      })

    })
  </script>

  </head>
  <body>
      <div class="center w100pre bs-example" >
        <form method="post" id="myform" action="${base}/work/plan/list">
            <input type="hidden" name="pagesize" value="${pagesize}"/>
            <input type="hidden" name="orderp" id="orderp" value="${orderp!}"/>
            <input type="hidden" name="sort" id="sort" value="${sort!}"/>
            <ul class="nav nav-tabs m-bottom">
              <li role="presentation" class="active"><a href="javascript:void(0);">任务列表</a></li>
              <li role="presentation"><a href="${base}/work/plan/add">新建任务</a></li>
            </ul>

            <div class="form-inline m-top m-b10">
              <div class="form-group">
                <label for="exampleInputName2">大项目</label>
                <select class="form-control" name="bname">
                  <option value="">请选择</option>
                  <#list bprojects as item>
                    <option value="${item.name}" <#if bname??><#if bname=item.name>selected</#if></#if>>${item.name}</option>
                  </#list>
                </select>
              </div>
              <div class="form-group">
                <label for="exampleInputName2">小项目</label>
                <select class="form-control" name="sname">
                  <option value="">请选择</option>
                  <#list sprojects as item>
                    <option value="${item.name}" <#if sname??><#if sname=item.name>selected</#if></#if>>${item.name}</option>
                  </#list>
                </select>
              </div>
              <div class="form-group">
                <label for="exampleInputName2">进度</label>
                <@common.plan_select_progress progress="${progress!}" name="progress" clazz="form-control" all=true/>
              </div>
              <div class="form-group">
                <label for="exampleInputName2">优先级</label>
                <@common.plan_select_priority priority="${priority!}" name="priority" clazz="form-control" all=true/>
              </div>
              <div class="form-group">
                <label for="exampleInputName2">显示已完成</label>
                <select class="form-control" name="showComplete">
                  <option value="">不显示</option>
                  <option value="showComplete" <#if showComplete??><#if showComplete?length gt 0>selected</#if></#if>>显示</option>
                </select>
              </div>
            </div>
            <div class="form-inline m-b10">
              <div class="form-group">
                <label for="exampleInputName2">开始时间</label>
                <input type="text" class="form-control" name="startTime" value="${startTime!}" id="startTime" readonly="readonly">
              </div>
              <div class="form-group">
                <label for="exampleInputName2">结束时间</label>
                <input type="text" class="form-control" name="endTime" value="${endTime!}"  id="endTime" readonly="readonly">
              </div>
              <div class="form-group">
                <label for="exampleInputName2">创建时间</label>
                <input type="text" class="form-control" name="createTime" value="${createTime!}"  id="createTime" readonly="readonly">
              </div>
            </div>
            <div class="form-inline m-bottom">
                <button type="submit" class="btn btn-default">查询</button>
                <button type="reset" class="btn btn-default">重置</button>
            </div>
            <table class="table table-bordered table-hover">
              <thead>
                <tr>
                  <th class="w36 font-vcenter font-b">#</th>
                  <th class="w108 font-vcenter font-b ordreby" p="create_time">创建时间</th>
                  <th class="w84 font-vcenter font-b ordreby" p="bname">大项目</th>
                  <th class="w84 font-vcenter font-b ordreby" p="sname">小项目</th>
                  <th class="font-vcenter font-b">标题</th>
                  <th class="font-vcenter font-b">内容</th>
                  <th class="w108 font-vcenter font-b ordreby" p="start_time">开始时间</th>
                  <th class="w108 font-vcenter font-b ordreby" p="end_time">结束时间</th>
                  <th class="w96 font-vcenter font-b ordreby" p="progress">进度</th>
                  <th class="w96 font-vcenter font-b ordreby" p="priority">优先级</th>
                  <th class="w48 font-vcenter font-b">操作</th>
                </tr>
              </thead>
              <tbody>
                <#list dataList as item>
                  <tr <#if (item_index%2)==0>class="info"</#if> pid="${item.id}">
                    <td class="font-vcenter">${item_index+1}</td>
                    <td class="font-vcenter"><#if item.createTime??>${item.createTime?string("yyyy-MM-dd")}</#if></td>
                    <td class="font-vcenter">${item.bname!}</td>
                    <td class="font-vcenter">${item.sname!}</td>
                    <td title="${item.title}"><div>${item.title}</div></td>
                    <!-- td title="${item.content}"><div><#if item.content?length lt 50>${item.content}<#else>${item.content[0..50]}...</#if></div></td -->
                    <td class="font-vleft">${item.content}</td>
                    <td class="font-vcenter"><input type="text" class="time-input" p="startTime" value="<#if item.startTime??>${item.startTime?string("yyyy-MM-dd")}</#if>" readonly="readonly"/></td>
                    <td class="font-vcenter"><input type="text" class="time-input" p="endTime"  value="<#if item.endTime??>${item.endTime?string("yyyy-MM-dd")}</#if>" readonly="readonly"/></td>
                    <td class="font-vcenter">
                      <div class="progress">
                        <div class="progress-bar" role="progressbar" aria-valuenow="${item.progress}" aria-valuemin="0" aria-valuemax="100" style="width: ${item.progress}%;">
                          ${item.progress}%
                        </div>
                      </div>
                    </td>
                    <td class="font-vcenter">
                      <div class="priority-margin"><@common.plan_span_priority priority="${item.priority}"/></div>
                    </td>
                    <td class="font-vcenter">
                      <@common.plan_select_progress progress="${item.progress}" clazz="progress-change"/>
                      <@common.plan_select_priority priority="${item.priority}" clazz="priority-change"/>
                      <a href="${base}/work/plan/add?id=${item.id}" class="p-edi">编辑</a>
                    </td>
                </#list>
              </tbody>
              <tfoot>
                <tr>
                  <td colspan="10">
                      ${page!}
                  </td>
                </tr>
              </tfoot>
          </table>
        </form>
      </div>
  </body>
</html>